// 1.引入vue和vuex
import Vue from "vue";
import Vuex from "vuex";

// 2.使用vuex插件
Vue.use(Vuex);

// 3. 实例一个vuex仓库 并暴漏
// 4. 给仓库传入配置(state mutations actions getters modeules)
export default new Vuex.Store({
  state: {
    count: 0,
    num: 2
  },
  /* 
    更改Vuex的store中的状态唯一的方法是提交mutation
    Vuex中的mutation 非常类似于事件 每个mutation 都有一个字符串的 事件类型
    (type)和一个回调函数(handler)
    mutations函数会接受state作为第一个参数
  */
  mutations: {
    increment(state) {
      state.count++;
    },
    decrement(state) {
      state.count--;
    },
    // 你可以向 store.commit 传入额外的参数，即mutation 的载荷 (payload) 
    // 在mutations 方法中第二个参数接受
    incrementN(state, payload) {
      state.count += payload.n;
    }
  },
  actions: {},
  getters: {}
});